<template>
	<div>
		<!-- QES-铸坯结果 -->
		<pol-title title="QES-铸坯结果"></pol-title>

		<div class="padding-lr border-solid bg-tm radius-sm main-box-height">
			<!-- 搜索框 -->
			<pol-search :form="searchForm" :schema="schema" @search="clickSearch" class="margin-top">
				<template #btnSlot>
					<div class="flex align-center">
						<span class="margin-right-lg">结果</span>
						<div class="padding-lr-xl solid radius-sm rest-el-checkbox" style="margin-right: 100px;">
							<el-checkbox v-model="checked1" size="large" class="margin-right-xxl">
								<template #default>
									<span class="text-white">未判定</span>
								</template>
							</el-checkbox>
							<el-checkbox v-model="checked2" size="large" class="margin-right-xxl">
								<template #default>
									<span class="text-white">合格</span>
								</template>
							</el-checkbox>
							<el-checkbox v-model="checked3" size="large" class="margin-right-xxl">
								<template #default>
									<span class="text-orange">可疑</span>
								</template>
							</el-checkbox>
							<el-checkbox v-model="checked4" size="large" class="margin-right-xxl">
								<template #default>
									<span class="text-red">不合格</span>
								</template>
							</el-checkbox>
						</div>
						<span>
							铸坯数量（
							<el-dropdown trigger="click" class="margin-left-sm">
								<span class="el-dropdown-link text-lg flex align-center text-green">
									{{liuVal}}
									<el-icon class="el-icon--right" color="#">
										<arrow-down />
									</el-icon>
								</span>
								<template #dropdown>
									<el-dropdown-menu>
										<el-dropdown-item @click="liuVal = '所有流'">所有流</el-dropdown-item>
										<el-dropdown-item @click="liuVal = '1流'">1流</el-dropdown-item>
										<el-dropdown-item @click="liuVal = '2流'">2流</el-dropdown-item>
										<el-dropdown-item @click="liuVal = '3流'">3流</el-dropdown-item>
										<el-dropdown-item @click="liuVal = '4流'">4流</el-dropdown-item>
										<el-dropdown-item @click="liuVal = '5流'">5流</el-dropdown-item>
										<el-dropdown-item @click="liuVal = '6流'">6流</el-dropdown-item>
										<el-dropdown-item @click="liuVal = '7流'">7流</el-dropdown-item>
									</el-dropdown-menu>
								</template>
							</el-dropdown>
							）：1080
						</span>
					</div>
				</template>
			</pol-search>

			<!-- 表格 -->
			<pol-table ref="polTableRef" v-bind="tableOpt" :isPage="true" :isSelection="true" height="calc(100vh - 340px)">
				<template #cz="{row}">
					<span class="text-green cursor" @click="details">详情</span>
				</template>

				<template #pageLeft>
					<div class="margin-right-xxl">
						<el-button icon="Upload" type="primary" class="btn-bg-blue btn-box padding-lr-xl" style="height: 40px; line-height: 40px;">导出</el-button>
					</div>
				</template>
			</pol-table>
		</div>

		<el-dialog v-model="dialogPlanPopup" title="详情" width="1400" center align-center class="search-light cast-popup">
			<div class="padding">
				<div class="flex align-center margin-top">
					<div class="flex-sub">二级坯号</div>
					<div class="flex-sub margin-lr">铸流序号</div>
					<div class="flex-sub">焰炼号</div>
					<div class="flex-sub margin-lr">二级炉次</div>
					<div class="flex-sub">切割时间</div>
					<div class="flex-sub margin-left">铸坯去向</div>
				</div>
				<div class="flex align-center margin-top">
					<div class="flex-sub lc-input">20250092</div>
					<div class="flex-sub margin-lr lc-input">浇注中</div>
					<div class="flex-sub lc-input">25-02-28 01:18</div>
					<div class="flex-sub margin-lr lc-input">480992</div>
					<div class="flex-sub lc-input">18</div>
					<div class="flex-sub margin-left lc-input">913</div>
				</div>
				
				<div class="" style="margin: 20px;">
					<span class="margin-right-lg">质量事件列表</span>
					<span class="margin-right-lg">质量事件数量:6</span>
					<span class="margin-right-lg">长度:5 m</span>
					<span class="margin-right-lg">质量结果:坏坯</span>
				</div>
				
				<pol-table ref="polTableRef" v-bind="tableOpt2" class="margin-top" height="500px" cellClassName="cellClass"></pol-table>
			</div>
		</el-dialog>
	</div>
</template>

<script setup>
	import { ref } from 'vue';
	const liuVal = ref('所有流')

	const checked1 = ref(null)
	const checked2 = ref(null)
	const checked3 = ref(null)
	const checked4 = ref(null)

	const furnaceNumberRef = ref(null)
	//搜素数据
	const searchForm = ref({
		CardTypeCode: '', //
		CardTypeName: '', //
	});

	//搜素配置
	const schema = ref({
		CardTypeCode: {
			label: '结晶器浇次',
			type: 'input',
			props: {
				type: 'text',
				placeholder: '选择浇次号',
				suffixIcon: 'layui-icon-component',
			},
			colProps: {
				md: 8,
			},
		},
		CardTypeName: {
			label: '关键字',
			type: 'input',
			props: {
				type: 'text',
				placeholder: '选择输入关键字搜索',
			},
			colProps: {
				md: 10,
			},
		}
	});

	function clickSearch() {

	}

	const polTableRef = ref(null); //表格ref
	//表格配置
	const columns = ref([
		{ label: '二级坯号', key: 'ItemCode', align: 'center' },
		{ label: '计划打号 ID', key: 'ItemName', align: 'center' },
		{ label: '实时打号 ID', key: 'ItemValue', align: 'center' },
		{ label: '铸流序号', key: 'IsDefault', align: 'center' },
		{ label: '二级炉次', key: 'P_IsSys', align: 'center' },
		{ label: '熔炼号', key: 'P_IsReadOnly', align: 'center' },
		{ label: '切割时间', key: 'gangbao', align: 'center', width: '250px' },
		{ label: '铸坯类型', key: 'kaishi', align: 'center' },
		{ label: '去向', key: 'chongzhi', align: 'center' },
		{ label: '质量事件数量', key: 'gangzhong', align: 'center', width: '140px' },
		{ label: 'QES结果', key: 'caozhuo', align: 'center', width: '120px' },
		{ label: '操作', key: 'cz', align: 'center', width: '80px', slot: true }
	]);

	//表格配置
	const tableOpt = ref({
		columns: columns.value,
		localData: [{
				ItemCode: '01029200',
				ItemName: '23404556',
				ItemValue: '0',
				IsDefault: '第1流',
				P_IsSys: '202405123',
				P_IsReadOnly: '202405123',
				gangbao: '2024年11月18日 08:32:14',
				kaishi: '正常坯',
				chongzhi: '冷床',
				gangzhong: '6',
				caozhuo: '未判定'
			},
			{
				ItemCode: '01029200',
				ItemName: '23404556',
				ItemValue: '0',
				IsDefault: '第1流',
				P_IsSys: '202405123',
				P_IsReadOnly: '202405123',
				gangbao: '2024年11月18日 08:32:14',
				kaishi: '正常坯',
				chongzhi: '冷床',
				gangzhong: '6',
				caozhuo: '未判定'
			},
			{
				ItemCode: '01029200',
				ItemName: '23404556',
				ItemValue: '0',
				IsDefault: '第1流',
				P_IsSys: '202405123',
				P_IsReadOnly: '202405123',
				gangbao: '2024年11月18日 08:32:14',
				kaishi: '正常坯',
				chongzhi: '冷床',
				gangzhong: '6',
				caozhuo: '未判定'
			},
			{
				ItemCode: '01029200',
				ItemName: '23404556',
				ItemValue: '0',
				IsDefault: '第1流',
				P_IsSys: '202405123',
				P_IsReadOnly: '202405123',
				gangbao: '2024年11月18日 08:32:14',
				kaishi: '正常坯',
				chongzhi: '冷床',
				gangzhong: '6',
				caozhuo: '未判定'
			},
			{
				ItemCode: '01029200',
				ItemName: '23404556',
				ItemValue: '0',
				IsDefault: '第1流',
				P_IsSys: '202405123',
				P_IsReadOnly: '202405123',
				gangbao: '2024年11月18日 08:32:14',
				kaishi: '正常坯',
				chongzhi: '冷床',
				gangzhong: '6',
				caozhuo: '未判定'
			},
			{
				ItemCode: '01029200',
				ItemName: '23404556',
				ItemValue: '0',
				IsDefault: '第1流',
				P_IsSys: '202405123',
				P_IsReadOnly: '202405123',
				gangbao: '2024年11月18日 08:32:14',
				kaishi: '正常坯',
				chongzhi: '冷床',
				gangzhong: '6',
				caozhuo: '未判定'
			},
			{
				ItemCode: '01029200',
				ItemName: '23404556',
				ItemValue: '0',
				IsDefault: '第1流',
				P_IsSys: '202405123',
				P_IsReadOnly: '202405123',
				gangbao: '2024年11月18日 08:32:14',
				kaishi: '正常坯',
				chongzhi: '冷床',
				gangzhong: '6',
				caozhuo: '未判定'
			},
			{
				ItemCode: '01029200',
				ItemName: '23404556',
				ItemValue: '0',
				IsDefault: '第1流',
				P_IsSys: '202405123',
				P_IsReadOnly: '202405123',
				gangbao: '2024年11月18日 08:32:14',
				kaishi: '正常坯',
				chongzhi: '冷床',
				gangzhong: '6',
				caozhuo: '未判定'
			},
			{
				ItemCode: '01029200',
				ItemName: '23404556',
				ItemValue: '0',
				IsDefault: '第1流',
				P_IsSys: '202405123',
				P_IsReadOnly: '202405123',
				gangbao: '2024年11月18日 08:32:14',
				kaishi: '正常坯',
				chongzhi: '冷床',
				gangzhong: '6',
				caozhuo: '未判定'
			},
			{
				ItemCode: '01029200',
				ItemName: '23404556',
				ItemValue: '0',
				IsDefault: '第1流',
				P_IsSys: '202405123',
				P_IsReadOnly: '202405123',
				gangbao: '2024年11月18日 08:32:14',
				kaishi: '正常坯',
				chongzhi: '冷床',
				gangzhong: '6',
				caozhuo: '未判定'
			},
			{
				ItemCode: '01029200',
				ItemName: '23404556',
				ItemValue: '0',
				IsDefault: '第1流',
				P_IsSys: '202405123',
				P_IsReadOnly: '202405123',
				gangbao: '2024年11月18日 08:32:14',
				kaishi: '正常坯',
				chongzhi: '冷床',
				gangzhong: '6',
				caozhuo: '未判定'
			},
			{
				ItemCode: '01029200',
				ItemName: '23404556',
				ItemValue: '0',
				IsDefault: '第1流',
				P_IsSys: '202405123',
				P_IsReadOnly: '202405123',
				gangbao: '2024年11月18日 08:32:14',
				kaishi: '正常坯',
				chongzhi: '冷床',
				gangzhong: '6',
				caozhuo: '未判定'
			},
			{
				ItemCode: '01029200',
				ItemName: '23404556',
				ItemValue: '0',
				IsDefault: '第1流',
				P_IsSys: '202405123',
				P_IsReadOnly: '202405123',
				gangbao: '2024年11月18日 08:32:14',
				kaishi: '正常坯',
				chongzhi: '冷床',
				gangzhong: '6',
				caozhuo: '未判定'
			},
			{
				ItemCode: '01029200',
				ItemName: '23404556',
				ItemValue: '0',
				IsDefault: '第1流',
				P_IsSys: '202405123',
				P_IsReadOnly: '202405123',
				gangbao: '2024年11月18日 08:32:14',
				kaishi: '正常坯',
				chongzhi: '冷床',
				gangzhong: '6',
				caozhuo: '未判定'
			},
			{
				ItemCode: '01029200',
				ItemName: '23404556',
				ItemValue: '0',
				IsDefault: '第1流',
				P_IsSys: '202405123',
				P_IsReadOnly: '202405123',
				gangbao: '2024年11月18日 08:32:14',
				kaishi: '正常坯',
				chongzhi: '冷床',
				gangzhong: '6',
				caozhuo: '未判定'
			},
		]
	});
	

	const dialogPlanPopup = ref(false)
	const details = () => {
		dialogPlanPopup.value = true
	}
	
	//表格配置
	const columns2 = ref([
		{ label: '二级坯号', key: 'ItemCode', align: 'center' },
		{ label: '计划打号 ID', key: 'ItemName', align: 'center' },
		{ label: '实时打号 ID', key: 'ItemValue', align: 'center' },
		{ label: '铸流序号', key: 'IsDefault', align: 'center' },
		{ label: '二级炉次', key: 'P_IsSys', align: 'center' },
		{ label: '熔炼号', key: 'P_IsReadOnly', align: 'center' },
		{ label: '切割时间', key: 'gangbao', align: 'center', width: '250px' },
		{ label: '铸坯类型', key: 'kaishi', align: 'center' },
	]);
	
	//表格配置
	const tableOpt2 = ref({
		columns: columns2.value,
		localData: [{
				ItemCode: '01029200',
				ItemName: '23404556',
				ItemValue: '0',
				IsDefault: '第1流',
				P_IsSys: '202405123',
				P_IsReadOnly: '202405123',
				gangbao: '2024年11月18日 08:32:14',
				kaishi: '正常坯',
				chongzhi: '冷床',
				gangzhong: '6',
				caozhuo: '未判定'
			},
			{
				ItemCode: '01029200',
				ItemName: '23404556',
				ItemValue: '0',
				IsDefault: '第1流',
				P_IsSys: '202405123',
				P_IsReadOnly: '202405123',
				gangbao: '2024年11月18日 08:32:14',
				kaishi: '正常坯',
				chongzhi: '冷床',
				gangzhong: '6',
				caozhuo: '未判定'
			},
			{
				ItemCode: '01029200',
				ItemName: '23404556',
				ItemValue: '0',
				IsDefault: '第1流',
				P_IsSys: '202405123',
				P_IsReadOnly: '202405123',
				gangbao: '2024年11月18日 08:32:14',
				kaishi: '正常坯',
				chongzhi: '冷床',
				gangzhong: '6',
				caozhuo: '未判定'
			},
			{
				ItemCode: '01029200',
				ItemName: '23404556',
				ItemValue: '0',
				IsDefault: '第1流',
				P_IsSys: '202405123',
				P_IsReadOnly: '202405123',
				gangbao: '2024年11月18日 08:32:14',
				kaishi: '正常坯',
				chongzhi: '冷床',
				gangzhong: '6',
				caozhuo: '未判定'
			},
			{
				ItemCode: '01029200',
				ItemName: '23404556',
				ItemValue: '0',
				IsDefault: '第1流',
				P_IsSys: '202405123',
				P_IsReadOnly: '202405123',
				gangbao: '2024年11月18日 08:32:14',
				kaishi: '正常坯',
				chongzhi: '冷床',
				gangzhong: '6',
				caozhuo: '未判定'
			},
			{
				ItemCode: '01029200',
				ItemName: '23404556',
				ItemValue: '0',
				IsDefault: '第1流',
				P_IsSys: '202405123',
				P_IsReadOnly: '202405123',
				gangbao: '2024年11月18日 08:32:14',
				kaishi: '正常坯',
				chongzhi: '冷床',
				gangzhong: '6',
				caozhuo: '未判定'
			},
			{
				ItemCode: '01029200',
				ItemName: '23404556',
				ItemValue: '0',
				IsDefault: '第1流',
				P_IsSys: '202405123',
				P_IsReadOnly: '202405123',
				gangbao: '2024年11月18日 08:32:14',
				kaishi: '正常坯',
				chongzhi: '冷床',
				gangzhong: '6',
				caozhuo: '未判定'
			},
			{
				ItemCode: '01029200',
				ItemName: '23404556',
				ItemValue: '0',
				IsDefault: '第1流',
				P_IsSys: '202405123',
				P_IsReadOnly: '202405123',
				gangbao: '2024年11月18日 08:32:14',
				kaishi: '正常坯',
				chongzhi: '冷床',
				gangzhong: '6',
				caozhuo: '未判定'
			},
			{
				ItemCode: '01029200',
				ItemName: '23404556',
				ItemValue: '0',
				IsDefault: '第1流',
				P_IsSys: '202405123',
				P_IsReadOnly: '202405123',
				gangbao: '2024年11月18日 08:32:14',
				kaishi: '正常坯',
				chongzhi: '冷床',
				gangzhong: '6',
				caozhuo: '未判定'
			},
			{
				ItemCode: '01029200',
				ItemName: '23404556',
				ItemValue: '0',
				IsDefault: '第1流',
				P_IsSys: '202405123',
				P_IsReadOnly: '202405123',
				gangbao: '2024年11月18日 08:32:14',
				kaishi: '正常坯',
				chongzhi: '冷床',
				gangzhong: '6',
				caozhuo: '未判定'
			},
			{
				ItemCode: '01029200',
				ItemName: '23404556',
				ItemValue: '0',
				IsDefault: '第1流',
				P_IsSys: '202405123',
				P_IsReadOnly: '202405123',
				gangbao: '2024年11月18日 08:32:14',
				kaishi: '正常坯',
				chongzhi: '冷床',
				gangzhong: '6',
				caozhuo: '未判定'
			},
			{
				ItemCode: '01029200',
				ItemName: '23404556',
				ItemValue: '0',
				IsDefault: '第1流',
				P_IsSys: '202405123',
				P_IsReadOnly: '202405123',
				gangbao: '2024年11月18日 08:32:14',
				kaishi: '正常坯',
				chongzhi: '冷床',
				gangzhong: '6',
				caozhuo: '未判定'
			},
			{
				ItemCode: '01029200',
				ItemName: '23404556',
				ItemValue: '0',
				IsDefault: '第1流',
				P_IsSys: '202405123',
				P_IsReadOnly: '202405123',
				gangbao: '2024年11月18日 08:32:14',
				kaishi: '正常坯',
				chongzhi: '冷床',
				gangzhong: '6',
				caozhuo: '未判定'
			},
			{
				ItemCode: '01029200',
				ItemName: '23404556',
				ItemValue: '0',
				IsDefault: '第1流',
				P_IsSys: '202405123',
				P_IsReadOnly: '202405123',
				gangbao: '2024年11月18日 08:32:14',
				kaishi: '正常坯',
				chongzhi: '冷床',
				gangzhong: '6',
				caozhuo: '未判定'
			},
			{
				ItemCode: '01029200',
				ItemName: '23404556',
				ItemValue: '0',
				IsDefault: '第1流',
				P_IsSys: '202405123',
				P_IsReadOnly: '202405123',
				gangbao: '2024年11月18日 08:32:14',
				kaishi: '正常坯',
				chongzhi: '冷床',
				gangzhong: '6',
				caozhuo: '未判定'
			},
		]
	});
</script>

<style lang="scss" scoped>
	.lc-input {
		padding: 10px;
		border: 1px solid #e1e1e1;
		border-radius: 4px;
		background-color: #f1f1f1;
	}
</style>